<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>cornfiy</title>
    <script type="text/javascript" src="https://www.cornify.com/js/cornify.js"></script>
</head>

<body>
    <h1>What has four eyes but cannot see?</h1>
    <p style="color:red;font-size:12px;">no idea? press F12 to check the key.</p>
    <h2>请输入谜底:<span class="key-word"></span></h2>
    <script>
        const pressed = []
        const secretCode = 'Mississippi'
        const span = document.querySelector('.key-word')
        let keyWord = []
        let isLetters = false

        window.addEventListener('keyup', (e) => {
            //console.log(e.key)
            if (e.keyCode >= 65 && e.keyCode <= 90) isLetters = true
            if (isLetters) pressed.push(e.key)
            pressed.splice(-secretCode.length - 1, pressed.length - secretCode.length)
            //console.log(pressed)
            span.innerHTML = pressed.join('-')
            isLetters = false
            if (pressed.join('').includes(secretCode)) {
                cornify_add()
                span.innerHTML = ''
            }

        })
        window.onload = () => {
            console.log('key: Mississippi')
        }
    </script>
</body>

</html>